<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<!-- 开发环境版本，包含了有帮助的命令行警告 -->
		<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
	</head>
	<body>
		
		<!-- 显示后台传递的文本数据 -->
		
		<div id="xdd">
			
			{{name}} 
			<br>
			类似于el:${name} 
			<hr>
			{{1+1}}
			
			<hr>
			姓名翻转
			{{name.split(" ").reverse().join("")}}
			<hr>
			{{namerevers()}}
			
			{{students[0].stu.name}}
			
		</div>
		
		
		<script>
		
			
			var vue = new Vue({
				el:"#xdd",
				data:{
					name:"abcdef",
					students:[{stu:{name:"呵呵"}}]
				},
				methods:{
					namerevers:function(){
						//vue的方法中 this就代表的是vue对象!
						var str = this.name.split(" ").reverse().join(" ");
						return str;
					}
				}
			});
			
		</script>
		
	</body>
</html>
